<template>
    <el-dialog
            title="成品数据信息"
            :visible.sync="dialogVisible"
            width="70%"
    >
        <el-alert
                title="使用说明(注意)"
                type="error"
                description="以下流程信息为成品信息,已经取消了无关的数据信息,只可用于特定场景,无法在下一次流程加载"
                :show-icon = "false"
                close-text="知道了"
        >
        </el-alert>
        <br/>
        <!--一个高亮显示的插件-->
        <codemirror
                :value="flowJsonData"
                :options="options"
                class="code"
        ></codemirror>
		<div class="ef-node-info-btn-area" style="margin-top:15px;">
			<el-button type="primary" icon="el-icon-document-copy" >复制</el-button>
			<el-button type="primary" icon="el-icon-edit-outline" >保存</el-button>
			
		</div>
    </el-dialog>
</template>

<script>
    import 'codemirror/lib/codemirror.css'
    import { codemirror } from 'vue-codemirror'

    require("codemirror/mode/javascript/javascript.js")

    export default {
        
        data() {
            return {
                dialogVisible: false,
                flowJsonData: {},
                options: {
                    mode: {name: "javascript", json: true},
                    lineNumbers: true
                }
            }
        },
        components: {
            codemirror
        },
        methods: {
            init(infoObj) {
                this.dialogVisible = true
				if(infoObj){
					this.flowJsonData = JSON.stringify(infoObj, null, 4).toString();
				}else{
					this.flowJsonData = JSON.stringify(this.data, null, 4).toString();
				}
                
            }
        }
    }
</script>
